/*bottom*/
.sec{
    position:relative;
    width:100px;
}
.bottomTips{
    position: absolute;
    height:20px;
    font-size:10px;
    background-color: wheat;
    display:none;
}
.bottomTips:before{
    content: '';
    border-bottom:5px solid wheat;
    border-left:5px solid transparent;
    border-right:5px solid transparent;
    border-top:5px solid transparent;
    position:absolute;
    left:30%;
    top:-50%;
}
/*top*/
.topTips{
    position: absolute;
    height:20px;
    font-size:10px;
    background-color: wheat;
    display:none;
    left:40%;
    top:-100%;
}
.topTips:before{
    content: '';
    border-bottom:5px solid transparent;
    border-left:5px solid transparent;
    border-right:5px solid transparent;
    border-top:5px solid wheat;
    position:absolute;
    left:30%;
    top:100%;
}
/*left*/
.tooltip{
    margin-left: 500px;
}
.leftTips{
    position: absolute;
    height:20px;
    font-size:10px;
    background-color: wheat;
    left:-50%;
    top:0;
    display: none;
}
.leftTips:before{
    content: '';
    border-bottom:5px solid transparent;
    border-left:5px solid wheat;
    border-right:5px solid transparent;
    border-top:5px solid transparent;
    position:absolute;
    right:-25%;
    top:30%;
}
/*right*/
.rightTips{
    position: absolute;
    height:20px;
    font-size:10px;
    background-color: wheat;
    right:-50%;
    top:0;
    display: none;
}
.rightTips:before{
    content: '';
    border-bottom:5px solid transparent;
    border-left:5px solid transparent;
    border-right:5px solid wheat;
    border-top:5px solid transparent;
    position:absolute;
    left:-25%;
    top:30%;
}